<template>
  <view class="app">
    <view class="search-btn mix-icon icon-shuxiangliebiao" @click="navSearch"
      >筛选</view
    >
    <view class="page-tip">我的订单</view>
    <view class="fixed-btn">
      <mix-button
        ref="confirmBtn"
        text="批量操作"
        :isConfirm="false"
        @onConfirm="showPopup('mixModal')"
      ></mix-button>
    </view>

    <mix-modal
      ref="mixModal2"
      title="提示"
      text="该功能需登录才能使用，是否登录?"
      @onConfirm="logout"
    ></mix-modal>
    <user-confirm
      ref="mixModal"
      title="提示"
      text="该功能需登录才能使用，是否登录?"
      @onConfirm="logout"
    ></user-confirm>
    <mix-loading v-if="isLoading"></mix-loading>
  </view>
</template>

<script>
import userConfirm from '../../components/user-confirm/user-confirm.vue';
export default {
  components: {
    userConfirm,
  },
  data() {
    return {};
  },
  methods: {
    navSearch() {
      uni.navigateBack();
    },
  },
};
</script>

<style>
page {
  background: #f7f8f9;
}
</style>
<style scoped lang="scss">
.app {
  padding-top: 15vh;
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  //   background: #fff;
  background-image: url('../../static/page_bg.png');
  background-repeat: no-repeat;
  background-size: 100% 600rpx;
}
.search-btn {
  position: absolute;
  left: 20rpx;
  top: calc(var(--status-bar-height) + 20rpx);
  z-index: 90;
  padding: 20rpx;
  font-size: 32rpx;
  color: white;
}
.page-tip {
  position: absolute;
  left: 50%;
  top: calc(var(--status-bar-height) + 44rpx);
  z-index: 90;
  margin-left: -80rpx;
  font-size: 34rpx;
  color: white;
  line-height: 34rpx;
}

.wrapper {
  position: relative;
  z-index: 90;
  padding-bottom: 40rpx;
}
.fixed-btn {
  position: absolute;
  left: 0;
  bottom: 6vh;
  z-index: 1;
  width: 100%;
  height: 90rpx;
  font-size: 24rpx;
  color: #999;
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  align-items: center;
}
</style>
